<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Lista de Usuarios</title>
        <style>
            .resaltado {
                background-color: #FFBBBB;
            }
        </style>
    </head>
    <body>
        <h1>
            ${empty buscar?"Listado de Usuarios":"Listado de Usuarios con criterio: "}
            ${buscar}
        </h1>
        <h2>Puede seleccionar un usuario para editar o borrar</h2>
        <ul>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[0].id}'>${listUsuario[0]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[1].id}'>${listUsuario[1]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[2].id}'>${listUsuario[2]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[3].id}'>${listUsuario[3]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[4].id}'>${listUsuario[4]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[5].id}'>${listUsuario[5]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[6].id}'>${listUsuario[6]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[7].id}'>${listUsuario[7]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[8].id}'>${listUsuario[8]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[9].id}'>${listUsuario[9]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[10].id}'>${listUsuario[10]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[11].id}'>${listUsuario[11]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[12].id}'>${listUsuario[12]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[13].id}'>${listUsuario[13]}</a></li>
            <li><a href='control?opcion=seleccionar&id=${listUsuario[14].id}'>${listUsuario[14]}</a></li>
        </ul>

        <a href='control?opcion=lista&buscar=${buscar}&pag=1'>«</a>&nbsp;&nbsp;
        <a href='control?opcion=lista&buscar=${buscar}&pag=${paginacion.paginaAnterior}'>‹</a>&nbsp;&nbsp;
        Pag ${paginacion.paginaActual}/${paginacion.totalPaginas}&nbsp;&nbsp;
        <a href='control?opcion=lista&buscar=${buscar}&pag=${paginacion.paginaSiguiente}'>›</a>&nbsp;&nbsp;
        <a href='control?opcion=lista&buscar=${buscar}&pag=${paginacion.totalPaginas}'>»</a>&nbsp;&nbsp;

        <br />
        <br />
        <form action="control" method="get">
            <input type="hidden" name="opcion" value="lista" />
            <input type="hidden" name="pag" value="1" />
            <label for="buscar">Buscar: </label><input type="text" id="buscar" name="buscar" value="${buscar}" />
            <input type="submit" value="Buscar" />
        </form>
        <br />

        <a href="control">Volver al Index</a>
    </body>
</html>
